import { createVNode, mergeProps, defineComponent, ref, computed, reactive, resolveDirective, unref, useSSRContext, resolveComponent, withCtx, createTextVNode, toDisplayString, openBlock, createBlock, createCommentVNode, getCurrentInstance, onMounted, onServerPrefetch, Fragment, renderList } from "vue";
import { ssrRenderAttrs, ssrInterpolate, ssrRenderClass, ssrGetDirectiveProps, ssrRenderComponent, ssrRenderSlot, ssrRenderList, ssrRenderAttr } from "vue/server-renderer";
import { useRoute, useRouter } from "vue-router";
import { I as IconWrapper, _ as _export_sfc, z as useL10n, p as useMainStore, C as CircleLoadingIcon, l as useNativeInfoStore, B as useUserInfoStore, D as getCountryShippingInfoApi, E as renderComponent, M as MessageDialog, j as useTrack, r as helpCenterDetailRoute, A as AppLayout, H as HelpCenterHeader, q as cdnUrl, w as base64Encode, x as helpSearchResultRoute, y as navNativePage, F as replaceImageSrcToCdnUrl } from "../entry-server.js";
import { u as useHelpCenterStore } from "./helpCenter-683376a8.js";
import { H as HelpCenterFooter } from "./HelpCenterFooter-6efa38aa.js";
import { _ as _sfc_main$8 } from "./PinchScrollZoomModal-9cbc65ce.js";
import { useI18n } from "vue-i18n";
import { storeToRefs } from "pinia";
import { u as useDocumentTitle } from "./index-17d7ee25.js";
import "path";
import "lodash-es";
import "dayjs";
import "dayjs/plugin/utc.js";
import "qs";
import "axios";
import "big.js/big.mjs";
import "@vueuse/core";
import "uuid";
import "url";
import "fs/promises";
import "./CustomerServiceIcon-20eb4cc1.js";
import "js-sha256";
import "viewerjs";
const LikeFillIcon = IconWrapper((props) => createVNode("svg", mergeProps(props, {
  "class": {
    "svg-color-fill": Boolean(props.fill)
  },
  "style": {
    "--fill-color": props.fill
  },
  "xmlns": "http://www.w3.org/2000/svg",
  "fill": "none",
  "viewBox": "0 0 28 28"
}), [createVNode("path", {
  "fill": "#444",
  "d": "M9 10.068v13.343H7.5a3 3 0 0 1-3-3v-7.343a3 3 0 0 1 3-3H9Zm6.941-4.656c1.08 1.098 1.068 2.968.93 4.015l-.04.264-.041.216a2.82 2.82 0 0 1-.04.161l3.5.007a3 3 0 0 1 2.926 3.658l-1.123 4.995a6 6 0 0 1-5.854 4.684L10.5 23.41V9.848c.805-.406 1.2-1.393 1.2-3.12 0-2.342 2.684-2.933 4.241-1.316Z",
  "clip-rule": "evenodd",
  "fill-rule": "evenodd",
  "data-follow-fill": "#444"
}, null)]));
const _sfc_main$7 = /* @__PURE__ */ defineComponent({
  __name: "HelpFeedback",
  __ssrInlineRender: true,
  props: {
    detailId: {}
  },
  setup(__props) {
    const { t } = useI18n();
    const finishedType = ref("");
    const route = useRoute();
    const trackPageName = computed(() => {
      var _a;
      const name = ((_a = route.meta) == null ? void 0 : _a.trackPageName) || "";
      return name ? name + "_" : "";
    });
    const usefullStatistics = reactive({
      helpful_count: 0,
      unhelpful_count: 0
    });
    return (_ctx, _push, _parent, _attrs) => {
      const _directive_track = resolveDirective("track");
      _push(`<div${ssrRenderAttrs(mergeProps({ class: "help-feedback" }, _attrs))} data-v-931d5d04><p class="content2-bold txt" data-v-931d5d04>${ssrInterpolate(unref(t)("helpCenter.article_helpful"))}</p><div class="${ssrRenderClass([[finishedType.value], "btns"])}" data-v-931d5d04><button${ssrRenderAttrs(mergeProps({
        type: "button",
        class: "like"
      }, ssrGetDirectiveProps(_ctx, _directive_track, { pId: trackPageName.value + "rate_yes", eventName: "rate_yes" }, void 0, {
        click: true,
        exposure: true
      })))} data-v-931d5d04>`);
      _push(ssrRenderComponent(unref(LikeFillIcon), { width: 20 }, null, _parent));
      _push(` ${ssrInterpolate(unref(t)("account.help.Yes"))} ${ssrInterpolate(finishedType.value && usefullStatistics.helpful_count ? `(${usefullStatistics.helpful_count})` : "")}</button><button${ssrRenderAttrs(mergeProps({
        type: "button",
        class: "dislike"
      }, ssrGetDirectiveProps(_ctx, _directive_track, { pId: trackPageName.value + "rate_no", eventName: "rate_no" }, void 0, {
        click: true,
        exposure: true
      })))} data-v-931d5d04>`);
      _push(ssrRenderComponent(unref(LikeFillIcon), { width: 20 }, null, _parent));
      _push(` ${ssrInterpolate(unref(t)("account.help.No"))} ${ssrInterpolate(finishedType.value && usefullStatistics.unhelpful_count ? `(${usefullStatistics.unhelpful_count})` : "")}</button></div></div>`);
    };
  }
});
const HelpFeedback_vue_vue_type_style_index_0_scoped_931d5d04_lang = "";
const _sfc_setup$7 = _sfc_main$7.setup;
_sfc_main$7.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/views/helpCenter/components/HelpFeedback.vue");
  return _sfc_setup$7 ? _sfc_setup$7(props, ctx) : void 0;
};
const HelpFeedback = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-931d5d04"]]);
const _sfc_main$6 = defineComponent({
  name: "ShippingTableCell",
  inheritAttrs: false
});
const ShippingTableCell_vue_vue_type_style_index_0_scoped_1f035174_lang = "";
function _sfc_ssrRender$1(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
  _push(`<td${ssrRenderAttrs(mergeProps({ class: "table-cell" }, _ctx.$attrs, _attrs))} data-v-1f035174>`);
  ssrRenderSlot(_ctx.$slots, "default", {}, null, _push, _parent);
  _push(`</td>`);
}
const _sfc_setup$6 = _sfc_main$6.setup;
_sfc_main$6.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/components/shippingTable/ShippingTableCell.vue");
  return _sfc_setup$6 ? _sfc_setup$6(props, ctx) : void 0;
};
const ShippingTableCell = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["ssrRender", _sfc_ssrRender$1], ["__scopeId", "data-v-1f035174"]]);
const _sfc_main$5 = defineComponent({
  name: "ShippingTableCellTime",
  components: {
    ShippingTableCell
  },
  props: {
    estimatedDays: {
      type: String,
      default: ""
    },
    usDeliveryDays: {
      type: String,
      default: ""
    },
    deliveryMethod: {
      type: String,
      default: ""
    },
    selectCountry: {
      type: String
    },
    estimatedDaysOtherDesc: {
      type: String,
      default: ""
    },
    estimatedDaysDesc: {
      type: String,
      default: ""
    }
  },
  setup(props) {
    const { t } = useI18n();
    const isSiteAbbUs = computed(() => {
      return props.deliveryMethod === "Standard" && props.selectCountry === "United States";
    });
    const shippingDate = computed(() => {
      if (props.estimatedDaysDesc) {
        return props.estimatedDaysDesc;
      }
      if (isSiteAbbUs.value && props.usDeliveryDays) {
        return props.usDeliveryDays;
      }
      const estimatedDays = props.estimatedDays;
      if (!/\d+-\d+/.test(estimatedDays)) {
        return estimatedDays + " " + t("common.time.days");
      }
      return estimatedDays.split("-").map((day) => Number(day)).join("-") + " " + t("common.time.days");
    });
    return {
      t,
      shippingDate,
      isSiteAbbUs
    };
  }
});
const ShippingTableCellTime_vue_vue_type_style_index_0_scoped_02fc79a2_lang = "";
function _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
  const _component_ShippingTableCell = resolveComponent("ShippingTableCell");
  _push(ssrRenderComponent(_component_ShippingTableCell, _attrs, {
    default: withCtx((_, _push2, _parent2, _scopeId) => {
      if (_push2) {
        _push2(`${ssrInterpolate(_ctx.shippingDate)} `);
        if (_ctx.estimatedDaysOtherDesc) {
          _push2(`<span data-v-02fc79a2${_scopeId}>${ssrInterpolate(_ctx.estimatedDaysOtherDesc)}</span>`);
        } else {
          _push2(`<!---->`);
        }
      } else {
        return [
          createTextVNode(toDisplayString(_ctx.shippingDate) + " ", 1),
          _ctx.estimatedDaysOtherDesc ? (openBlock(), createBlock("span", { key: 0 }, toDisplayString(_ctx.estimatedDaysOtherDesc), 1)) : createCommentVNode("", true)
        ];
      }
    }),
    _: 1
  }, _parent));
}
const _sfc_setup$5 = _sfc_main$5.setup;
_sfc_main$5.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/components/shippingTable/ShippingTableCellTime.vue");
  return _sfc_setup$5 ? _sfc_setup$5(props, ctx) : void 0;
};
const ShippingTableCellTime = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["ssrRender", _sfc_ssrRender], ["__scopeId", "data-v-02fc79a2"]]);
const _sfc_main$4 = defineComponent({
  name: "ShippingTableCellCosts",
  components: {
    ShippingTableCell
  },
  props: {
    item: {
      type: Object,
      default: () => ({})
    },
    country: {
      type: String,
      default: ""
    },
    // 新用户 1 老用户 2
    userType: {
      type: Number,
      default: 2
    }
  },
  setup(props) {
    const { t } = useI18n();
    const { uts } = useL10n();
    const { language: langCode } = storeToRefs(useMainStore());
    function getCellContent() {
      const country = props.country;
      if (["Morocco", "Brazil"].includes(country))
        return getMoroccoFreight();
      if (country === "Mexico")
        return getMexicoFreight();
      return getDefaultFreight();
    }
    function getDefaultFreight() {
      if (Number(freeShippingPoint.value) === 0) {
        return props.userType === 1 ? t("product.detail.Free_Shipping_On_New_Orders") : t("product.detail.Free_Shipping_On_All_Orders");
      } else {
        return overAmountFreeShipping.value;
      }
    }
    function getMoroccoFreight() {
      const gradientShippingFee = props.item.gradient_shipping_fee;
      if (gradientShippingFee.length === 0)
        return getDefaultFreight();
      const [underGradientShipping, extraGradientShipping, moreGradientShipping] = gradientShippingFee;
      const underAmount = uts(underGradientShipping.max_price);
      const underFreight = uts(underGradientShipping.shipping_fee);
      const extraAmount = uts(extraGradientShipping.min_price);
      const extraExceedAmount = uts(extraGradientShipping.max_price);
      const extrafreight = uts(extraGradientShipping.shipping_fee);
      const extraSlot = {
        order_amount: extraAmount,
        exceed_order_amount: extraExceedAmount,
        extra_freight: extrafreight
      };
      const moreAmount = uts(moreGradientShipping.min_price);
      const moreFreight = uts(moreGradientShipping.shipping_fee);
      return () => createVNode("div", { class: "gradient-text" }, [
        createVNode("span", {}, t("shopping.morocco_free_for_orders_over", { order_amount: underAmount, freight: underFreight })),
        createVNode("span", {}, t("shopping.morocco_free_for_orders_over_two", extraSlot)),
        createVNode(
          "span",
          {},
          props.country === "Morocco" ? t("shopping.morocco_free_for_orders_over_three", { order_amount: moreAmount, freight: moreFreight }) : t("shopping.free_shipping_over", { free_shipping_point: moreAmount }) + freeShippingDesc.value
        )
      ]);
    }
    function getMexicoFreight() {
      const gradientShippingFee = props.item.gradient_shipping_fee;
      if (gradientShippingFee.length === 0)
        return getDefaultFreight();
      const freight = uts(props.item.shipping_fee);
      const freeShippingPoint2 = uts(props.item.free_shipping_point);
      return () => createVNode("div", {}, [
        createVNode("span", {}, t("shopping.mexico_freight", { freight, free_shipping_point: freeShippingPoint2 })),
        createVNode("span", {}, t("shopping.mexico_extra_freight"))
      ]);
    }
    const freeShippingDesc = computed(() => {
      if (props.item.free_shipping_desc) {
        return " " + props.item.free_shipping_desc;
      }
      return "";
    });
    const overAmountFreeShipping = computed(() => {
      const { free_shipping_point: freeShippingPoint2, shipping_fee: shippingFee } = props.item;
      const localShippingFee = uts(shippingFee);
      const localFreeShippingOver = uts(freeShippingPoint2, "int");
      const renderSpan = () => {
        if (freeShippingDesc.value) {
          return createVNode("span", { style: "margin: 0px 4px;" }, freeShippingDesc.value);
        }
        return null;
      };
      return () => createVNode("div", {}, [
        createVNode("span", { class: "text" }, localShippingFee),
        createVNode("span", { class: ["text", langCode.value === "en" ? "green-first-word" : "text-red"] }, [
          t("shopping.free_shipping_over", { free_shipping_point: localFreeShippingOver }),
          renderSpan()
        ])
      ]);
    });
    const freeShippingPoint = computed(() => {
      return props.item.free_shipping_point;
    });
    const content = getCellContent();
    return () => createVNode(ShippingTableCell, {}, content);
  }
});
const ShippingTableCellCosts_vue_vue_type_style_index_0_scoped_633c3bbe_lang = "";
const _sfc_setup$4 = _sfc_main$4.setup;
_sfc_main$4.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/components/shippingTable/ShippingTableCellCosts.vue");
  return _sfc_setup$4 ? _sfc_setup$4(props, ctx) : void 0;
};
const ShippingTableCellCosts = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-633c3bbe"]]);
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
  __name: "ShippingTable",
  __ssrInlineRender: true,
  props: {
    shippingContent: { default: () => ({}) },
    loading: { type: Boolean, default: false },
    selectCountry: {}
  },
  setup(__props) {
    const props = __props;
    const { t } = useI18n();
    const shippingList = computed(() => {
      if (!props.shippingContent)
        return [];
      return props.shippingContent.content;
    });
    const isEmpty = computed(() => {
      if (!props.shippingContent)
        return true;
      return !Array.isArray(props.shippingContent.content) || props.shippingContent.content.length === 0;
    });
    const country = computed(() => {
      return props.shippingContent.country;
    });
    const userType = computed(() => {
      return props.shippingContent.user_type;
    });
    return (_ctx, _push, _parent, _attrs) => {
      _push(`<table${ssrRenderAttrs(mergeProps({ class: "table" }, _attrs))} data-v-68953d27><colgroup data-v-68953d27><col data-v-68953d27><col data-v-68953d27><col data-v-68953d27></colgroup><thead data-v-68953d27><tr tabindex="0" data-v-68953d27><th class="table-th" data-v-68953d27>${ssrInterpolate(unref(t)("product.shipping.shopping_method"))}</th><th class="table-th" data-v-68953d27>${ssrInterpolate(unref(t)("shopping.l_delivery_time"))}</th><th class="table-th table-th-costs" data-v-68953d27>${ssrInterpolate(unref(t)("shopping.costs"))}</th></tr></thead><tbody data-v-68953d27>`);
      if (_ctx.loading) {
        _push(`<tr class="table-tr" data-v-68953d27>`);
        _push(ssrRenderComponent(ShippingTableCell, {
          class: "table-loading",
          colspan: "3"
        }, {
          default: withCtx((_, _push2, _parent2, _scopeId) => {
            if (_push2) {
              _push2(ssrRenderComponent(unref(CircleLoadingIcon), null, null, _parent2, _scopeId));
            } else {
              return [
                createVNode(unref(CircleLoadingIcon))
              ];
            }
          }),
          _: 1
        }, _parent));
        _push(`</tr>`);
      } else if (isEmpty.value) {
        _push(`<tr class="table-tr" data-v-68953d27>`);
        _push(ssrRenderComponent(ShippingTableCell, { colspan: "3" }, {
          default: withCtx((_, _push2, _parent2, _scopeId) => {
            if (_push2) {
              _push2(`N/A`);
            } else {
              return [
                createTextVNode("N/A")
              ];
            }
          }),
          _: 1
        }, _parent));
        _push(`</tr>`);
      } else {
        _push(`<!--[-->`);
        ssrRenderList(shippingList.value, (item) => {
          _push(`<tr tabindex="0" class="table-tr" data-v-68953d27>`);
          _push(ssrRenderComponent(ShippingTableCell, null, {
            default: withCtx((_, _push2, _parent2, _scopeId) => {
              if (_push2) {
                _push2(`${ssrInterpolate(item.delivery_method === "Economic" ? unref(t)("product.shipping.economic_delivery") : item.delivery_method_multi_language)}`);
              } else {
                return [
                  createTextVNode(toDisplayString(item.delivery_method === "Economic" ? unref(t)("product.shipping.economic_delivery") : item.delivery_method_multi_language), 1)
                ];
              }
            }),
            _: 2
          }, _parent));
          _push(ssrRenderComponent(ShippingTableCellTime, {
            "select-country": _ctx.selectCountry,
            "estimated-days": item.estimated_days,
            "us-delivery-days": item.estimated_days_desc,
            "delivery-method": item.delivery_method,
            "estimated-days-other-desc": item.estimated_days_other_desc || "",
            "estimated-days-desc": item.estimated_days_desc || ""
          }, null, _parent));
          _push(ssrRenderComponent(ShippingTableCellCosts, {
            item,
            country: country.value,
            "user-type": userType.value
          }, null, _parent));
          _push(`</tr>`);
        });
        _push(`<!--]-->`);
      }
      _push(`</tbody></table>`);
    };
  }
});
const ShippingTable_vue_vue_type_style_index_0_scoped_68953d27_lang = "";
const _sfc_setup$3 = _sfc_main$3.setup;
_sfc_main$3.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/components/shippingTable/ShippingTable.vue");
  return _sfc_setup$3 ? _sfc_setup$3(props, ctx) : void 0;
};
const ShippingTable = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-68953d27"]]);
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
  __name: "CountrySelect",
  __ssrInlineRender: true,
  props: {
    countries: { default: () => [] },
    value: { default: "" }
  },
  emits: ["update:value", "change"],
  setup(__props, { emit: emits }) {
    const props = __props;
    const { t } = useI18n();
    return (_ctx, _push, _parent, _attrs) => {
      _push(`<label${ssrRenderAttrs(mergeProps({
        class: "select-wrap",
        for: "shipping-country"
      }, _attrs))} data-v-b8f7c4d6><span class="select-title" data-v-b8f7c4d6>${ssrInterpolate(unref(t)("account.common.country"))}</span><span class="select-country" data-v-b8f7c4d6>${ssrInterpolate(props.value)}</span><select id="shipping-country"${ssrRenderAttr("value", props.value)} name="country" class="select"${ssrRenderAttr("aria-label", unref(t)("about.common.select_country"))} data-v-b8f7c4d6><!--[-->`);
      ssrRenderList(_ctx.countries, (country) => {
        _push(`<option${ssrRenderAttr("value", country.country_name)} data-v-b8f7c4d6>${ssrInterpolate(country.country_name)}</option>`);
      });
      _push(`<!--]--></select><div class="select-arrow" data-v-b8f7c4d6></div></label>`);
    };
  }
});
const CountrySelect_vue_vue_type_style_index_0_scoped_b8f7c4d6_lang = "";
const _sfc_setup$2 = _sfc_main$2.setup;
_sfc_main$2.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/views/helpCenter/components/CountrySelect.vue");
  return _sfc_setup$2 ? _sfc_setup$2(props, ctx) : void 0;
};
const CountrySelect = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-b8f7c4d6"]]);
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
  __name: "ShippingInfoComp",
  __ssrInlineRender: true,
  setup(__props) {
    const { appContext } = getCurrentInstance();
    const { t } = useI18n();
    const nativeInfoStore = useNativeInfoStore();
    useUserInfoStore();
    const mainStore = useMainStore();
    const route = useRoute();
    computed(() => {
      var _a;
      const name = ((_a = route.meta) == null ? void 0 : _a.trackPageName) || "";
      return name ? name + "_" : "";
    });
    const state = reactive({
      loading: false,
      selectCountry: "",
      currentCountryShipping: void 0,
      countryShippingCache: {},
      siteCountries: [],
      isUsWarehouse: route.query.is_us_warehouse ? Number(route.query.is_us_warehouse) : 0
    });
    const currentSiteCountry = computed(() => {
      return mainStore.countries.filter((item) => {
        var _a;
        return item.site_abb === ((_a = mainStore.getCurrentCountry) == null ? void 0 : _a.site_abb);
      });
    });
    function getCountryShipping(countryName) {
      state.loading = true;
      const cacheShipping = state.countryShippingCache[countryName];
      if (cacheShipping) {
        state.currentCountryShipping = cacheShipping;
        state.loading = false;
        return;
      }
      const data = { country_name: countryName, is_us_warehouse: state.isUsWarehouse };
      if (nativeInfoStore.isFromApp) {
        Object.assign(data, { user_id: route.query.user_id });
      }
      return getCountryShippingInfoApi(data).then((res) => {
        state.loading = false;
        state.currentCountryShipping = res;
        state.countryShippingCache[countryName] = res;
        if (state.selectCountry === "") {
          state.selectCountry = res.country;
        }
      }).catch((error) => {
        state.loading = false;
        errorMessageDialog();
      });
    }
    function errorMessageDialog(err) {
      const { destroy } = renderComponent({
        component: MessageDialog,
        appContext,
        props: {
          content: t("common.activity.oops"),
          showCancelButton: false,
          okText: t("common.activity.ok"),
          onClick: () => destroy(),
          onOk: () => destroy()
        }
      });
    }
    onMounted(() => {
      if (nativeInfoStore.isFromApp) {
        const hostEnv = nativeInfoStore.getNativeInfo();
        const query = route.query;
        const appPassedCountry = query.country || query.country_name || hostEnv.country;
        const siteCountry = mainStore.countries.find((country) => country.country_name === appPassedCountry);
        const site = siteCountry ? siteCountry.site_abb : "";
        state.selectCountry = siteCountry ? appPassedCountry : mainStore.getCurrentCountryName;
        state.siteCountries = site ? mainStore.countries.filter((country) => country.site_abb === site) : [mainStore.getCurrentCountry].filter((val) => val !== void 0);
      } else {
        const { getCurrentCountryName } = useMainStore();
        state.siteCountries = currentSiteCountry.value;
        state.selectCountry = getCurrentCountryName;
      }
      getCountryShipping(state.selectCountry);
    });
    return (_ctx, _push, _parent, _attrs) => {
      _push(`<div${ssrRenderAttrs(mergeProps({ class: "info" }, _attrs))} data-v-5bc2af4f><div class="sc" data-v-5bc2af4f><p data-v-5bc2af4f>${ssrInterpolate(unref(t)("product.shipping.shipping_rates_text"))}</p>`);
      _push(ssrRenderComponent(CountrySelect, {
        value: state.selectCountry,
        "onUpdate:value": ($event) => state.selectCountry = $event,
        class: "country-select",
        countries: state.siteCountries,
        onChange: getCountryShipping
      }, null, _parent));
      _push(ssrRenderComponent(ShippingTable, {
        "shipping-content": state.currentCountryShipping,
        "select-country": state.selectCountry,
        loading: state.loading
      }, null, _parent));
      if (state.selectCountry === "United States") {
        _push(`<p class="us-text" data-v-5bc2af4f>${ssrInterpolate(unref(t)("product.shipping.area_outside"))}</p>`);
      } else {
        _push(`<!---->`);
      }
      _push(`</div></div>`);
    };
  }
});
const ShippingInfoComp_vue_vue_type_style_index_0_scoped_5bc2af4f_lang = "";
const _sfc_setup$1 = _sfc_main$1.setup;
_sfc_main$1.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/views/helpCenter/components/ShippingInfoComp.vue");
  return _sfc_setup$1 ? _sfc_setup$1(props, ctx) : void 0;
};
const ShippingInfoComp = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-5bc2af4f"]]);
const __default__ = defineComponent({
  name: "HelpCenterDetail",
  components: { HelpCenterHeader, HelpCenterFooter, PinchScrollZoomModal: _sfc_main$8, HelpFeedback, AppLayout, ShippingInfoComp }
});
const _sfc_main = /* @__PURE__ */ defineComponent({
  ...__default__,
  __ssrInlineRender: true,
  setup(__props) {
    useTrack();
    const trackPageName = computed(() => {
      var _a;
      const name = ((_a = helpCenterDetailRoute.meta) == null ? void 0 : _a.trackPageName) || "";
      return name ? name + "_" : "";
    });
    ref(false);
    const route = useRoute();
    const router = useRouter();
    const i18n = useI18n();
    const t = i18n.t;
    const helpCenterStore = useHelpCenterStore();
    const mainStore = useMainStore();
    const nativeInfoStore = useNativeInfoStore();
    const detail = computed(() => helpCenterStore.helpCenterDetail);
    const isSupportWebp = ref(false);
    const imgSrc = ref(null);
    ref({});
    const deliveryCountry = computed(() => {
      const currDeliveryCountry = mainStore.getCurrentCountry;
      return currDeliveryCountry ? currDeliveryCountry.country_name : "";
    });
    function onClickRightBtn() {
      if (nativeInfoStore.isFromApp) {
        const origin = window.location.origin;
        const appLink = "patpat://?action=webpage&is_hidden_navigation_bar=1&isEnCode=true&url=" + base64Encode(`${origin}${helpSearchResultRoute.path}?platform=app`);
        navNativePage({ url: appLink }, false);
      } else {
        router.push({ name: helpSearchResultRoute.name, params: { lang: i18n.locale.value } });
      }
    }
    function hiddenPreviewer() {
      imgSrc.value = null;
    }
    function imageSizeReplace(text) {
      if (text) {
        return replaceImageSrcToCdnUrl(text.replace(/\n+/gs, ""), "335x0", isSupportWebp.value);
      } else {
        return text;
      }
    }
    function getFirstTitleIcon(id) {
      const iconMap2 = generateIdMap(helpCenterStore.helpCenterList);
      if (!iconMap2[id])
        return "";
      return cdnUrl({ url: iconMap2[id] });
    }
    function generateIdMap(list) {
      return list.reduce((res, curr) => {
        if (curr.children.length) {
          const childMap = generateIdMap(curr.children.map((item) => ({ ...item, icon: curr.icon })));
          Object.assign(res, childMap);
        }
        res[curr.id] = curr.icon;
        return res;
      }, {});
    }
    async function onUpdateDetailData() {
      const id = route.params.detailsId;
      await helpCenterStore.getHelpCenterListData();
      await helpCenterStore.getHelpCenterDetailData(id);
      useDocumentTitle(`${mainStore.seoPatPatTdk} - ${detail.value.title || t("common.faq_support")}`);
    }
    useDocumentTitle(`${mainStore.seoPatPatTdk} - ${detail.value.title || t("common.faq_support")}`);
    onServerPrefetch(async () => {
      const ssrContext = useSSRContext();
      isSupportWebp.value = ssrContext.isSupportWebp;
      await onUpdateDetailData();
    });
    function initialImgPinchScrollZoom() {
      var _a;
      const imgElements = [...((_a = document.getElementById("help-center-detail")) == null ? void 0 : _a.getElementsByTagName("img")) || []];
      imgElements.forEach((img) => {
        img.onclick = () => {
          imgSrc.value = img.getAttribute("src");
        };
      });
    }
    onMounted(() => {
      const detailsId = Number(route.params.detailsId);
      const noDetail = Object.keys(helpCenterStore.helpCenterDetail).length === 0;
      const noEqualId = detailsId !== helpCenterStore.helpCenterDetail.id;
      if (noEqualId) {
        helpCenterStore.helpCenterDetail = {};
      }
      if (noDetail || noEqualId) {
        onUpdateDetailData().then(() => {
          initialImgPinchScrollZoom();
        });
      } else {
        initialImgPinchScrollZoom();
      }
    });
    return (_ctx, _push, _parent, _attrs) => {
      _push(ssrRenderComponent(AppLayout, mergeProps({ id: "help-center-detail" }, _attrs), {
        default: withCtx(({ scrollTop }, _push2, _parent2, _scopeId) => {
          if (_push2) {
            _push2(`<div class="sticky-title" data-v-cb419fc8${_scopeId}>`);
            _push2(ssrRenderComponent(HelpCenterHeader, {
              "left-btn-event-name": trackPageName.value + "back",
              "right-btn-event-name": trackPageName.value + "search_button",
              title: unref(t)("common.faq"),
              "show-close-icon": true,
              "show-right": false,
              onRightClick: onClickRightBtn
            }, null, _parent2, _scopeId));
            _push2(`<p class="${ssrRenderClass([{ "txt-bottom": scrollTop > 0 }, "title-txt"])}" data-v-cb419fc8${_scopeId}><img${ssrRenderAttr("src", getFirstTitleIcon(detail.value.id))} width="28" height="28" alt="" data-v-cb419fc8${_scopeId}><span class="content2-bold" data-v-cb419fc8${_scopeId}>${ssrInterpolate(detail.value.title)}</span></p></div><div class="help-center-content" data-v-cb419fc8${_scopeId}>`);
            if (detail.value.type === 2) {
              _push2(`<div data-v-cb419fc8${_scopeId}>`);
              if (typeof detail.value.content == "object") {
                _push2(`<!--[-->`);
                if (detail.value.content.header) {
                  _push2(`<div class="detail-header" data-v-cb419fc8${_scopeId}>${imageSizeReplace(detail.value.content.header)}</div>`);
                } else {
                  _push2(`<!---->`);
                }
                _push2(`<!--[-->`);
                ssrRenderList(detail.value.content.step, (step, index) => {
                  _push2(`<div data-v-cb419fc8${_scopeId}><div class="content2-bold" data-v-cb419fc8${_scopeId}>${ssrInterpolate(step.title)}</div><!--[-->`);
                  ssrRenderList(step.description, (desc, idx) => {
                    _push2(`<div data-v-cb419fc8${_scopeId}><div data-v-cb419fc8${_scopeId}>${imageSizeReplace(desc.text)}</div><!--[-->`);
                    ssrRenderList(desc.image, (img) => {
                      _push2(`<img${ssrRenderAttr("src", unref(cdnUrl)({ url: img }))} alt="" data-v-cb419fc8${_scopeId}>`);
                    });
                    _push2(`<!--]--></div>`);
                  });
                  _push2(`<!--]--></div>`);
                });
                _push2(`<!--]-->`);
                if (detail.value.content.footer) {
                  _push2(`<div class="detail-footer" data-v-cb419fc8${_scopeId}>${imageSizeReplace(detail.value.content.footer)}</div>`);
                } else {
                  _push2(`<!---->`);
                }
                _push2(`<!--]-->`);
              } else {
                _push2(`<!---->`);
              }
              _push2(`</div>`);
            } else {
              _push2(`<!---->`);
            }
            if (detail.value.type === 1) {
              _push2(`<div data-v-cb419fc8${_scopeId}>`);
              if (typeof detail.value.content === "string") {
                _push2(`<div data-v-cb419fc8${_scopeId}>${imageSizeReplace(detail.value.content)}</div>`);
              } else {
                _push2(`<!---->`);
              }
              _push2(`</div>`);
            } else {
              _push2(`<!---->`);
            }
            _push2(`</div>`);
            if (detail.value.id == 941 || detail.value.id == 872) {
              _push2(ssrRenderComponent(ShippingInfoComp, {
                class: "shipping-info-wrap",
                "select-country": deliveryCountry.value
              }, null, _parent2, _scopeId));
            } else {
              _push2(`<!---->`);
            }
            _push2(ssrRenderComponent(HelpFeedback, {
              "detail-id": detail.value.id
            }, null, _parent2, _scopeId));
            _push2(`<p class="content2-bold contact-txt" data-v-cb419fc8${_scopeId}>${ssrInterpolate(unref(t)("helpCenter.more_question"))}</p>`);
            _push2(ssrRenderComponent(HelpCenterFooter, null, null, _parent2, _scopeId));
            if (imgSrc.value) {
              _push2(ssrRenderComponent(_sfc_main$8, {
                "img-src": imgSrc.value,
                onHide: hiddenPreviewer
              }, null, _parent2, _scopeId));
            } else {
              _push2(`<!---->`);
            }
          } else {
            return [
              createVNode("div", { class: "sticky-title" }, [
                createVNode(HelpCenterHeader, {
                  "left-btn-event-name": trackPageName.value + "back",
                  "right-btn-event-name": trackPageName.value + "search_button",
                  title: unref(t)("common.faq"),
                  "show-close-icon": true,
                  "show-right": false,
                  onRightClick: onClickRightBtn
                }, null, 8, ["left-btn-event-name", "right-btn-event-name", "title"]),
                createVNode("p", {
                  class: ["title-txt", { "txt-bottom": scrollTop > 0 }]
                }, [
                  createVNode("img", {
                    src: getFirstTitleIcon(detail.value.id),
                    width: "28",
                    height: "28",
                    alt: ""
                  }, null, 8, ["src"]),
                  createVNode("span", { class: "content2-bold" }, toDisplayString(detail.value.title), 1)
                ], 2)
              ]),
              createVNode("div", { class: "help-center-content" }, [
                detail.value.type === 2 ? (openBlock(), createBlock("div", { key: 0 }, [
                  typeof detail.value.content == "object" ? (openBlock(), createBlock(Fragment, { key: 0 }, [
                    detail.value.content.header ? (openBlock(), createBlock("div", {
                      key: 0,
                      class: "detail-header",
                      innerHTML: imageSizeReplace(detail.value.content.header)
                    }, null, 8, ["innerHTML"])) : createCommentVNode("", true),
                    (openBlock(true), createBlock(Fragment, null, renderList(detail.value.content.step, (step, index) => {
                      return openBlock(), createBlock("div", { key: index }, [
                        createVNode("div", { class: "content2-bold" }, toDisplayString(step.title), 1),
                        (openBlock(true), createBlock(Fragment, null, renderList(step.description, (desc, idx) => {
                          return openBlock(), createBlock("div", { key: idx }, [
                            createVNode("div", {
                              innerHTML: imageSizeReplace(desc.text)
                            }, null, 8, ["innerHTML"]),
                            (openBlock(true), createBlock(Fragment, null, renderList(desc.image, (img) => {
                              return openBlock(), createBlock("img", {
                                key: img,
                                src: unref(cdnUrl)({ url: img }),
                                alt: ""
                              }, null, 8, ["src"]);
                            }), 128))
                          ]);
                        }), 128))
                      ]);
                    }), 128)),
                    detail.value.content.footer ? (openBlock(), createBlock("div", {
                      key: 1,
                      class: "detail-footer",
                      innerHTML: imageSizeReplace(detail.value.content.footer)
                    }, null, 8, ["innerHTML"])) : createCommentVNode("", true)
                  ], 64)) : createCommentVNode("", true)
                ])) : createCommentVNode("", true),
                detail.value.type === 1 ? (openBlock(), createBlock("div", { key: 1 }, [
                  typeof detail.value.content === "string" ? (openBlock(), createBlock("div", {
                    key: 0,
                    innerHTML: imageSizeReplace(detail.value.content)
                  }, null, 8, ["innerHTML"])) : createCommentVNode("", true)
                ])) : createCommentVNode("", true)
              ]),
              detail.value.id == 941 || detail.value.id == 872 ? (openBlock(), createBlock(ShippingInfoComp, {
                key: 0,
                class: "shipping-info-wrap",
                "select-country": deliveryCountry.value
              }, null, 8, ["select-country"])) : createCommentVNode("", true),
              createVNode(HelpFeedback, {
                "detail-id": detail.value.id
              }, null, 8, ["detail-id"]),
              createVNode("p", { class: "content2-bold contact-txt" }, toDisplayString(unref(t)("helpCenter.more_question")), 1),
              createVNode(HelpCenterFooter),
              imgSrc.value ? (openBlock(), createBlock(_sfc_main$8, {
                key: 1,
                "img-src": imgSrc.value,
                onHide: hiddenPreviewer
              }, null, 8, ["img-src"])) : createCommentVNode("", true)
            ];
          }
        }),
        _: 1
      }, _parent));
    };
  }
});
const HelpCenterDetail_vue_vue_type_style_index_0_scoped_cb419fc8_lang = "";
const _sfc_setup = _sfc_main.setup;
_sfc_main.setup = (props, ctx) => {
  const ssrContext = useSSRContext();
  (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("src/views/helpCenter/HelpCenterDetail.vue");
  return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
};
const HelpCenterDetail = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-cb419fc8"]]);
export {
  HelpCenterDetail as default
};
